<template>
    <div>
        <ul>
            <li>
                <router-link to="/foo">foo</router-link>
            </li>
            <li>
                <router-link to="/bar">bar</router-link>
            </li>
            <li>
                <router-link to="/lazyLoad">lazyLoad</router-link>
            </li>
            <li>
                <router-link to="/parent">parent</router-link>
            </li>
            <li>
                <router-link to="/parent/child">parent/child</router-link>
            </li>
            <li>
                <router-link to="/parent/brother">parent/brother</router-link>
            </li>
        </ul>
    </div>
</template>

<script>
    export default {
        name:'footer'
    }
</script>

<style lang="less" scoped rel="stylesheet/less" type="text/css">
    @import '../../assets/css/flex';
    div{
        margin: 50px;
        text-align: center;
    }
    ul{
        .flex-auto;
        font-family:'Microsoft YaHei UI';
        font-size:20px;
        li{
            margin-bottom: 2rem;
        }
    }
</style>